<template>
	<view class="peoject-warp">
		<view class="search-item">
			<!-- 搜索框 -->
			<Topsearch :showCate='false' :showFocus="showFocus" :searchKeyWord="searchKeyWord" :currentCateIndex="cateIndex" @currentCateClick='changeCateIndex'
			 @searchEvent="searchExpertList" @searchClear='searchExpertList'/>
			 <view class="re-filter-contain">
				 <view class="re-filter-contain-left">
					<LiFilter @change="change" @select="select" ref="refLiFilter" :datalist="datalist" :height="height" :mineChecked="mineChecked" />
				 </view>
				 <view @click="resetList()" class="search-cate-text last-item">
				 	<!-- <text class="icon iconfont iconchongzhi"></text> -->
					<image src="https://www.innovationgloble.com/wxs/img/wx/kcxcx/clear.png" mode="widthFix"></image>
				 	重置
				 </view>
			 </view>
		</view>
		<view class="expert-list">
			<view v-if="projectData.length>0" class="">
				<ActivityItem ref='ActivityItem' :activityList="projectData"></ActivityItem>
			</view>
		</view>
		<view v-if="parseFloat(total)===0">
			<view class="sysNodata">
				<image src="../../static/nomorepro.png" mode=""></image>
				<view class="sysNodataTitle">
					暂无相关数据
				</view>
			</view>
		</view>
		<view v-if="parseFloat(total)===0">
			<view class="recomm-contain" >
				<view class="sysForYou">
					<image src="https://www.innovationgloble.com/wxs/img/wx/gkxcx/pro_for_you.png"></image>
				</view>
				<view class="recommend-search-contain">
					<ActivityItem ref='Item' :activityList="searchRecommendActList"></ActivityItem>
				</view>
			</view>
			<view class="sysBottomShow">
				已加载今日全部推荐
			</view>
		</view>
		
		<view class="sysBottomShow" v-if="isLastPage&&parseFloat(total)!=0&&projectData.length>3">
			我是有底线的
		</view>
		<view class="totop" @click="top" :style="{'display':(flag===true? 'block':'none')}">
			<uni-icons type="arrowthinup" size="24" color="#444444" style="font-weight: bold;"></uni-icons>
		</view>
	</view>
</template>

<script>
	import LiFilter from '@/components/Li-Filter/Li-Filter.vue';
	import ActivityItem from '@/components/page-componnet/activity-item.vue'
	import Topsearch from '@/components/top-search-tab.vue'
	import searchCondition from '@/utils/search_condition.js';

	export default {
		components: {
			LiFilter,
			ActivityItem,
			Topsearch
		},
		data() {
			return {
				showFocus:false,
				height: 0.6,
				flag: false,
				searchValue: '',
				isPlace: true,
				mineChecked:false,
				searchRecommendActList: [],
				datalist: {
					filterType: 1,
					data: [
						// {
						// 	title: '综合', //排序头的名称
						// 	value: 'a',
						// 	type: 1, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
						// 	data: []
						// },
						{
							title: '全国', //排序头的名称
							value: 'b',
							type: 2, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
							data: []
						},
						{
							title: '活动类型', //排序头的名称
							value: 'c',
							type: 2, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
							data: []
						},{
							title: '活动方式', //排序头的名称
							value: 'c',
							type: 2, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
							data: []
						},
					]
				},
				params: {
					pageSize: 15,
					pageNum: 1,
					keyword: '',
					sort: '',
					provinceId: '',
					cityId: '',
					activitiesType: ''
				},
				indexArr: '',
				valueArr: '',
				loadingText: "正在加载...",
				filterDropdownValue: null,
				filterData: [],
				projectData: [],
				total: -1,
				recTotal: -1,
				recProjectData: [],
				isShowDeleate: false,
				isLastPage:false
			};
		},
		filters: {
			outData(value) {
				return JSON.stringify(value);
			}
		},
		onLoad: function(option) {
			this.getExpertList();
			this.getProjectType();
			searchCondition.loadAct();
		},
		watch: {
			//监听输入框值
			searchValue(val) {
				val === '' ? this.isShowDeleate = false : this.isShowDeleate = true
			},
			//监听没有数值
			total(val) {
				if (parseFloat(val) === 0) {
					console.log('total====', val)
					this.recProjectData = [];
					this.getAllProjectList()
				}
			}
		},
		methods: {
			searchDetail(data) {
				this.params.keyword = data.keyWord;
				this.params.pageNum = 1;
				this.projectData = [];
				this.getExpertList();
			},
			getactRecommendList() {
				this.$request.get({
					url: 'innovationActivities/showByPage',
					data: {
						pageSize: 10,
						pageNumber: 1,
					},
				}).then(res => {
					let array = res.list;
					this.searchRecommendActList = array.length > 5 ? array.slice(0, 5) : array;
				});
			},
			//获取融资类型检索条件
			getNowFina() {
				this.$request.get({
					url: 'dict/getTreeByType?type=financial_type',
					data: {
						type: 'financial_type'
					},
				}).then(res => {
					let obj = {
						value: '全部',
						code: ''
					}
					this.financialType = res.children;
					this.financialType.unshift(obj)
					uni.stopPullDownRefresh();
				})
			},
			//获取当前阶段检索条件
			getNowProcess() {
				this.$request.get({
					url: 'dict/getTreeByType?type=process_type',
					data: {
						type: 'process_type'
					},
				}).then(res => {
					let obj = {
						value: '全部',
						code: ''
					}
					this.processType = res.children;
					this.processType.unshift(obj)
				})
			},
			//获取所有的省份
			getAllProvince() {
				this.$request.get({
					url: 'region/queryAllProvinces.json',
					data: {},
				}).then(res => {
					for (let i = 0; i < res.length; i++) {
						res[i].value = res[i].regionId;
						res[i].text = res[i].name;
						res[i].optionType = 1;
					}
					let list0 = {
						text: '全国',
						value: '全国'
					};
					res.unshift(list0);
					let AreaItem = {
						title: '全国', //排序头的名称
						value: 'c',
						type: 2, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
						data: res
					};

					this.datalist.data.splice(0, 1, AreaItem);
				})
			},
			//根据省份获取所在市
			getCity(provinceId, index) {
				this.$request.get({
					url: 'region/queryCityByProvinceId.json',
					data: {
						provinceId
					},
				}).then(res => {
					for (let i = 0; i < res.length; i++) {
						res[i].value = res[i].regionId;
						res[i].text = res[i].name;
					}
					this.$set(this.datalist.data[0].data[index], 'children', res)
				})
			},
			// 获取项目筛选条件
			getProjectType() {
				this.$request.get({
					url: 'dict/getTreeByType?type=activities_type',
					data: {
						type: 'activities_type'
					}
				}).then(res => {
					console.log('activities_type', res)
					let activeTypeList = res.children;
					let list0 = {
						text: '全部',
						value: '全部'
					};
					for (let i = 0; i < activeTypeList.length; i++) {
						activeTypeList[i].text = activeTypeList[i].value;
						activeTypeList[i].value = activeTypeList[i].code;
					}
					activeTypeList.unshift(list0);

					let tempdata = {
						filterType: 1,
						data: []
					};
					let normalItem = {
						title: '综合', //排序头的名称
						value: 'a',
						type: 1, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
						data: [{
								value: 1,
								text: '综合'
							},
							{
								value: 2,
								text: '最新'
							}
						]
					};
					let projectItem = {
						title: '活动类型', //排序头的名称
						value: 'b',
						type: 1, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
						data: activeTypeList
					};
					let AreaItem = {
						title: '全国', //排序头的名称
						value: 'c',
						type: 2, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
						data: []
					};
					let activeMethods = {
						title: '活动方式', //排序头的名称
						value: 'd',
						type: 1, //类型，0：没有下拉选项，1：单项下拉列表，2：多项列表，如地区选择
						data: [
							{
								value: 2,
								text: '全部'
							},
							{
								value: 0,
								text: '线上活动'
							},
							{
								value: 1,
								text: '线下活动'
							}
						]
					}
					// tempdata.data[0]=normalItem;
					tempdata.data[0]=AreaItem;
					tempdata.data[1]=projectItem;
					tempdata.data[2]=activeMethods;

					// this.datalist = tempdata;
					// this.datalist.data[0] = normalItem;

					this.datalist.data[1] = projectItem;
					this.datalist.data[2] = activeMethods
					this.getAllProvince();
				});
			},
			select(e) {
				let nodes = e.nodes;
				if (e.root.value === 'b') {
					if (nodes.text === "全部") {
						this.params.activitiesType = ''
					} else {
						this.params.activitiesType = nodes.code
					}
				}
				if (e.root.value === 'c') {
					if (nodes.length > 0 && nodes[0].text === "全国") {
						this.params.provinceId = '';
						this.params.cityId = '';
					} else {
						this.params.provinceId = e.nodes[0].value;
						this.params.cityId = e.nodes[1].value;
					}

				}
				if (e.root.value === 'a') {
					if (e.data.text == '综合') {
						this.params.sort = ''
					}
					if (e.data.text == '最新') {
						this.params.sort = "desc";
					}
				}
				if (e.root.value === 'd') {
					console.log(nodes)
					if (nodes.text === '全部') {
						this.params.activitiesMode = ''
					} else {
						this.params.activitiesMode = nodes.value
					}
				}
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 0
				});
				this.params.pageNum = 1;
				this.projectData = [];
				this.getExpertList();
				this.mineChecked = true;
			},
			change(e) {

			},
			//活动报名
			goSignUp(item) {
				let userInfo = uni.getStorageSync('userInfo');

				if (!userInfo || !userInfo.userId) {
					uni.showToast({
						title: '请先登录',
						icon: 'none'
					})
					return false;
				}
				let obj = {
					imgAddrs: '',
					activitiesTopic: '',
					startTime: '',
					endTime: '',
					provinceName: '',
					cityName: '',
					regNumber: '',
					isFee: '',
					regFee: '',
					id: '',
					activitiesMode: '',
				};
				for (let key in obj) {
					obj[key] = item[key]
				}
				let json = JSON.stringify(obj);
				uni.navigateTo({
					url: `/pagesA/act-order/act-order?param=${json}`
				})
			},
			//項目詳情
			toDetails(item) {
				console.log(item)
				uni.navigateTo({
					url: "../active-details/active-details?id=" + item.id
				})
			},
			top() { //回到顶部
				uni.pageScrollTo({
					scrollTop: 0,
					duration: 300
				});
			},
			onPageScroll(e) { //根据距离顶部距离是否显示回到顶部按钮
				if (e.scrollTop > 600) { //当距离大于600时显示回到顶部按钮
					this.flag = true
				} else { //当距离小于600时显示回到顶部按钮
					this.flag = false
				}
			},
			
			search() {
				this.params.keyword = this.searchValue;
				this.params.pageNum = 1;
				this.projectData = [];
				this.getExpertList();
			},
			//清空输入框
			handleClearValue() {
				this.searchValue = ''
			},
			//获取融资阶段
			onLoadType() {
				let params = {
					type: 'financial_type'
				};
				this.$request.get({
					url: 'dict/getTreeByType',
					data: params
				}).then(res => {
					console.log('融资阶段', res)
					let financialType = res.children;
					let arr = [];
					res.children.forEach((item, key) => {
						console.log(item)
						arr.push({
							name: item.value,
							value: item.code
						})
					})
					this.filterData[3].submenu[0].submenu = arr;
					console.log(this.filterData)
				})
			},
			//获取技术领域
			onLoadArea() {
				let params = {
					type: 'skill_area'
				};
				this.$request.get({
					url: 'dict/getTreeByType',
					data: params
				}).then(res => {
					console.log('技术领域', res)
					let financialType = res.children;
					let arr = [];
					res.children.forEach((item, key) => {
						console.log(item)
						arr.push({
							"name": item.value,
							"value": item.code,
							"submenu": []
						})
					})
					this.filterData[2].submenu = arr;
					console.log(this.filterData)
				})
			},
			//接收菜单结果
			confirm(e) {
				this.indexArr = e.index;
				this.valueArr = e.value;
				return;
			},
			//获取商品全部列表
			getAllProjectList() {
				let params = this.params;
				params.keyword = '';
				this.$request.post({
					url: 'projectInfo/pageQueryList.json',
					data: params
				}).then(res => {
					console.log('商品列表', res)
					this.recTotal = res.count;
					res.data.forEach((item,index)=>{
						const activitiesIndustryName =  item.activitiesIndustryName;
						if(activitiesIndustryName){
							item.activitiesIndustryName = item.activitiesIndustryName.split(',').slice(0, 2);
						}
					});
					// res.data.length > 0 ? res.data.map((item, key) => {
					// 	res.data[key].activitiesIndustryName = item.activitiesIndustryName.split(',').slice(0, 2)
					// }) : ''
					this.recProjectData = this.recProjectData.concat(res.data);
				})
			},
			//点击搜索查询 专家列表
			searchExpertList(data){
				console.log('searchExpertList data', data);
				const conditions = searchCondition.composeCondition(data.keyWord,'activity');
				const params = {
					pageSize:15,
					pageNum:1,
					...conditions
				};
				this.projectData = [];
				this.params = params;
				this.getExpertList();
			},
			resetList(){
				this.params = {
					pageSize:15,
					pageNum:1
				};
				this.projectData = [];
				this.mineChecked = false;
				this.getExpertList();
				
				this.$refs.refLiFilter.setTitle();
			},
			//加载专家列表
			getExpertList() {
				uni.showLoading({
					title: '加载中'
				});
				console.log("===params==="+JSON.stringify(this.params));
				let params = this.params;
				this.$request.get({
					url: 'innovationActivities/showByPage',
					data: params
				}).then(res => {
					uni.hideLoading();
					console.log('专家列表', res)
					res.list.length > 0 ? res.list.map((item, key) => {
						res.list[key].activitiesIndustryName = item.activitiesIndustryName ? item.activitiesIndustryName.split(',') :
							''
					}) : ''
					this.total = res.total;
					
					this.projectData = this.projectData.concat(res.list);
					// this.projectData = res.list;
					this.isLastPage = res.isLastPage
					uni.stopPullDownRefresh();
					if(this.projectData.length===0){
						this.getactRecommendList()
					}
				})

			},
			toGoods(item) {
				console.log('toGoods', item)
				uni.navigateTo({
					url: '../project-details/project-details?id=' + item.projectId
				})
			}
		},
		onPullDownRefresh() {
			this.params.pageNum = 1;
			this.isLastPage = false;
			this.projectData = [];
			this.getExpertList();
		},
		//上拉加载，需要自己在page.json文件中配置"onReachBottomDistance"
		onReachBottom() {
			if (!this.isLastPage) {
				this.params.pageNum += 1
				this.getExpertList();
			}
		},
		onHide(){
			this.$refs.ActivityItem.resetOpcity()
			
		}
	}
</script>
<style  lang="scss">
	page{
		background-color: rgba(245, 245, 245, 1);
		min-height: 100vh;
	}
	.expert-list {
		padding-top: 180upx;
		background-color: #FFFFFF;
	}
    .recomm-contain {
		background-color: #FFFFFF;
	}
	.expert-item {
		box-sizing: border-box;
		background-color: #FFFFFF;
		margin-bottom: 14upx;

		.active-t {
			box-sizing: border-box;
			padding: 36upx 26upx 26upx 32upx;
			display: flex;
			justify-content: space-between;
			border-bottom: 2upx solid #F2F2F2;

			.act-l {
				width: 260upx;
				height: 186upx;
				margin-right: 26upx;

				image {
					width: 260upx;
					height: 186upx;
				}
			}

			.act-r {
				flex: 1;

				.act-r-1 {
					font-size: 30upx;
					font-family: PingFangSC-Semibold, PingFang SC;
					font-weight: bold;
					color: rgba(51, 51, 51, 1);
					line-height: 44upx;
					height: 88upx;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
					overflow: hidden;
					text-overflow: ellipsis;
				}

				.act-r-2 {
					height: 49upx;
					width: 406upx;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;

					span {
						font-size: 24upx;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: rgba(25, 109, 236, 1);
						display: inline-block;
						margin-right: 12upx;
					}
				}

				.act-r-3 {
					color: #FF6600;
					font-size: 36upx;

					span {
						font-size: 22upx;
					}
				}

				.act-r-3-text {
					color: #FF6600;
					font-size: 30upx;
				}
			}
		}

		.active-b {
			display: flex;
			justify-content: space-between;
			box-sizing: border-box;
			padding: 22upx 32upx 16upx 32upx;

			.active-b-1 {
				flex: 1;

				>view:nth-child(1) {
					font-size: 24upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: rgba(163, 163, 163, 1);
					line-height: 24upx;
					margin-bottom: 14upx;
				}

				>view:nth-child(2) {
					font-size: 28upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #444444;
					line-height: 28upx;
				}
			}

			.active-b-2 {
				flex: 1;

				>view:nth-child(1) {
					font-size: 24upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: rgba(163, 163, 163, 1);
					line-height: 24upx;
					margin-bottom: 14upx;
				}

				>view:nth-child(2) {
					font-size: 28upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					color: #444444;
					line-height: 28upx;
				}
			}

			.active-b-3 {
				flex: 1;
				text-align: right;
				padding-top: 4upx;

				view {
					width: 136upx;
					height: 56upx;
					border-radius: 6upx;
					font-size: 26upx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;
					line-height: 56upx;
					text-align: center;
					float: right;
				}

				.status-1 {
					color: #196DEC;
					background-color: #F3F7FF;
				}

				.status-2 {
					background-color: #008BFF;
					color: #FFFFFF;
				}

				.status-3 {
					background-color: #F2F2F2;
					color: #757575;
				}
			}

		}
	}

	.notice {
		display: flex;
		justify-content: space-between;
		padding: 7upx 32upx 14upx 32upx;
		margin-top: 168upx;
		background: linear-gradient(109deg, rgba(255, 249, 237, 1) 0%, rgba(255, 245, 237, 1) 100%);

		.notice-title {
			position: relative;
			width: 144upx;
			height: 54upx;
			background: linear-gradient(102deg, rgba(255, 152, 23, 1) 0%, rgba(252, 81, 38, 1) 100%);
			border-radius: 31upx;
			text-align: center;
			color: #FFFFFF;
			font-size: 26upx;
			line-height: 54upx;
			margin-top: 14upx;
		}

		.notice-wheel {
			flex: 1;

			.notice-swiper {
				height: 70upx;
				line-height: 70upx;

				.notice-text {
					font-size: 26upx;
					font-weight: 400;
					color: rgba(222, 90, 2, 1);
					line-height: 70upx;
				}
			}
		}
	}

	.recommend {
		height: 120upx;
		line-height: 120upx;
		text-align: center;

		view {
			font-size: 34upx;
			font-family: FZZCHJW--GB1-0, FZZCHJW--GB1;
			font-weight: normal;
			color: rgba(68, 68, 68, 1);
			line-height: 120upx;
			display: inline-block;
			font-weight: bold;
			position: relative;

			image {
				width: 32upx;
				height: 36upx;
				display: inline-block;
				vertical-align: middle;
				margin-bottom: 10upx;
				margin-right: 12upx;
			}

			&::before {
				content: '';
				display: block;
				width: 68upx;
				height: 2upx;
				background-color: #A3A3A3;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				left: -90upx;
			}

			&::after {
				content: '';
				display: block;
				width: 68upx;
				height: 2upx;
				background-color: #A3A3A3;
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				right: -90upx;
			}
		}
	}

	.no-data {
		width: 100%;
		height: 340upx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0 4upx 22upx 0 rgba(0, 0, 0, 0.03);
		box-sizing: border-box;
		padding-top: 62upx;

		.no-data-image {
			display: flex;
			flex-direction: column;
			align-items: center;
			image {
				// width: 172upx;
				height: 304upx;
			}
		}

		.no-data-text {
			text-align: center;
			font-size: 26upx;
			font-weight: 400;
			color: rgba(163, 163, 163, 1);
			margin-top: 16upx;
		}
	}

	.totop {
		width: 88upx;
		height: 88upx;
		box-shadow: 0px 4upx 8upx 0upx rgba(0, 0, 0, 0.04);
		border: 2upx solid rgba(235, 235, 235, 1);
		position: fixed;
		right: 20upx;
		bottom: 56upx;
		background-color: #FFFFFF;
		border-radius: 50%;
		line-height: 88upx;
		text-align: center;
	}
	.last-item {
		margin-right: 0upx;
	}
	.search-cate-text {
		display: flex;
		align-items: center;
		font-size: 24upx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #A3A3A3;
		padding-right: 30upx;
		/* margin-right: 46upx; */
		/* position: absolute;
		top: 12upx;
		right: 30upx;
		z-index: 4 */
	}
	.search-cate-text image{
		width: 24upx;
		height: 24upx;
		margin-right: 10upx;
	}
	.search-item {
		position: fixed;
		top: 0;
		height: 170upx;
		background-color: #FFFFFF;
		z-index: 999;
		width: 100%;
		.re-filter-contain {
			position: relative;
			height: 82upx;
			border-bottom: 1upx solid #F2F2F2;
			background-color: #ffffff;
			display: flex;
			align-items: center;
		}
		.re-filter-contain-left {
			flex: 1;
		}
	}

	// .search-input {
	// 	display: flex;
	// 	height: 78upx;
	// 	margin-bottom: 18upx;
	// 	width: 100%;
	// 	box-sizing: border-box;
	// 	padding: 0 32upx 0 32upx;
	// 	background-color: #FFFFFF;
	// 	z-index: 9999;

	// 	.search-input-value {
	// 		flex: 1;
	// 		height: 78upx;
	// 		background: #f5f5f5;
	// 		border-radius: 6upx;
	// 		position: relative;

	// 		.search {
	// 			width: 32upx;
	// 			height: 34upx;
	// 			position: absolute;
	// 			left: 26rpx;
	// 			top: 47%;
	// 			transform: translateY(-50%);
	// 			z-index: 999;

	// 			image {
	// 				width: 32upx;
	// 				height: 34upx;
	// 			}
	// 		}

	// 		.delete {
	// 			width: 28upx;
	// 			height: 28upx;
	// 			position: absolute;
	// 			right: 20upx;
	// 			top: 50%;
	// 			transform: translateY(-50%);
	// 			z-index: 999;
	// 		}

	// 		input {
	// 			height: 78upx;
	// 			border-radius: 6upx;
	// 			font-size: 28upx;
	// 			padding-left: 72upx;
	// 		}
	// 	}

	// 	.search-placehoder {
	// 		font-size: 28upx;
	// 		font-weight: 400;
	// 		color: #A3A3A3;
	// 	}

	// 	.search-text {
	// 		width: 88upx;
	// 		height: 78upx;
	// 		line-height: 78upx;
	// 		text-align: right;
	// 		font-size: 30upx;
	// 		font-weight: 400;
	// 		color: #333333;
	// 	}
	// }

	.accountHead {
		width: 46upx;
		border-radius: 50%;
		display: inline-block;
		vertical-align: middle;
		margin-right: 20upx;
		margin-bottom: 4upx;
	}

	.position {
		width: 18upx;
		height: 22upx;
		display: inline-block;
		vertical-align: middle;
		margin-bottom: 4upx;
		margin-right: 10upx;
	}

	.peoject-warp {
		width: 100%;
	}

	.project-icon {
		width: 30upx;
		height: 30upx;
		display: inline-block;
		vertical-align: middle;
		margin-bottom: 4upx;
		margin-right: 10upx;
	}

	.datajson {
		z-index: 2;
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		height: 250px;
		padding: 0 10px;
		background-color: rgba(255, 255, 255, .8);
		backdrop-filter: blur(15px);
		-webkit-backdrop-filter: blur(15px);
		font-size: 12px;

		.text {
			margin-top: 10px;
		}

		.item {
			width: 15px;
		}
	}

	.place {
		height: 160upx;
		width: 100%;
		margin-top: 155upx;
		position: relative;
		box-sizing: border-box;
		padding-left: 58upx;
		position: relative;

		.uni-icons-close {
			position: absolute;
			right: 4upx;
			top: -15upx;
		}

		image {
			width: 100%;
			height: 160upx;
			position: absolute;
			top: 0;
			left: 0;
			z-index: -1;
		}

		h3 {
			color: #11659C;
			z-index: 999;
			font-size: 28upx;
			padding-top: 18upx;
			margin-bottom: 6upx;

			span {
				font-size: 34upx;
				color: #DE5A02;
				font-weight: bold;
			}
		}

		.project-button {
			width: 180upx;
			height: 46upx;
			background: linear-gradient(294deg, rgba(26, 106, 158, 1) 0%, rgba(6, 117, 190, 1) 100%);
			box-shadow: 0upx 4upx 8upx 0upx rgba(23, 107, 162, 0.21);
			border-radius: 23upx;
			font-size: 24upx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: rgba(255, 255, 255, 1);
			line-height: 46upx;
			text-align: center;
		}


	}

	.m40 {
		margin-top: 166upx;
	}

	.product-list {
		.product {
			padding: 36upx 32upx 30upx 32upx;
			background-color: #fff;
			margin-bottom: 14upx;

			.project-1 {
				display: flex;
				justify-content: space-between;
				margin-bottom: 30upx;

				.project-1-left {
					width: 190upx;
					height: 136upx;
					border-radius: 4upx;
					margin-right: 24upx;

					image {
						width: 190upx;
						height: 136upx;
						border-radius: 4upx;
					}
				}

				.project-1-right {
					flex: 1;

					>view:nth-child(1) {
						font-size: 30upx;
						font-weight: 700;
						color: #444444;
						line-height: 38upx;
						margin-bottom: 6upx;
					}

					>view:nth-child(2) {
						display: flex;
						flex-wrap: wrap;
						margin-bottom: 12upx;
						height: 38upx;
						overflow: hidden;

						.project-span {
							font-size: 22upx;
							font-weight: 400;
							color: rgba(51, 51, 51, 1);
							margin-right: 30upx;
							position: relative;

							&::after {
								content: '';
								display: block;
								width: 2upx;
								height: 20upx;
								background: rgba(117, 117, 117, 1);
								position: absolute;
								right: -15upx;
								top: 50%;
								transform: translateY(-50%);
							}
						}

					}

					>view:nth-child(3) {
						font-size: 24upx;
						font-weight: 500;
						color: rgba(250, 100, 0, 1);
					}
				}
			}

			.project-2 {
				background: rgba(249, 249, 249, 1);
				border-radius: 4upx;
				padding: 14upx 24upx;

				view {
					color: #A3A3A3;
					font-size: 24upx;
					font-weight: 400;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 2;
					overflow: hidden;
					text-overflow: ellipsis;
					line-height: 38upx;
				}


			}

			.project-3 {
				display: flex;
				justify-content: space-between;
				margin-top: 24upx;

				>view:nth-child(1) {
					font-size: 24upx;
					font-weight: 400;
					color: rgba(117, 117, 117, 1);
					width: 530upx;
					overflow: hidden;
					white-space: nowrap;
					text-overflow: ellipsis;
				}

				>view:nth-child(2) {
					flex: 1;
					font-size: 24upx;
					font-weight: 400;
					color: rgba(117, 117, 117, 1);
					text-align: right;
				}
			}
		}

	}

	.goods-list {
		background-color: #F5F5F5;
		// min-height: 100vh;

		.loading-text {
			display: flex;
			justify-content: center;
			align-items: center;
			height: 30px;
			color: #979797;
			font-size: 12px;
		}

	}
	.bottom-text{
		text-align: center;
		font-size:26upx;
		font-weight:400;
		color:rgba(163,163,163,1);
		margin: 16upx;
	}
</style>
